<template>
	<view class="mian">
		<!-- #ifdef MP-WEIXIN -->
			<navbar :bgColor="bgColor" :btnColors='btnColor' title="申请分销商" :isGoBack="true" :isNotice="true" :visible="true"></navbar>
		<!-- #endif -->	
		<view class="content">
			<view class=""  v-if="userInfo.is_group ==0 || userInfo.is_group ==3" >
				
			
			<view class="flex uni-form-item all_shop border-b">				
				<view class="title" style="width: 125rpx;">姓名</view>
				<input class="uni-input ml-30 text-right" v-model="formData.realname" focus placeholder="请输入姓名"  placeholder-style="text-align: right;font-size:23rpx"/>
			</view>	
			<view class="flex uni-form-item all_shop border-b">
				<view class="title" style="width: 125rpx;">电话</view>
				<input class="uni-input ml-30 text-right" v-model="formData.phone" focus placeholder="请输入电话"  placeholder-style="text-align: right;font-size:23rpx"/>
			</view>	
			
			<view class="flex uni-form-item all_shop border-b" @click="getbox()">
				<view class="title" style="width: 185rpx;">居住城市</view>
				<input class="uni-input ml-30" v-model="formData.area_info" focus placeholder="请输入所在地区"  disabled  placeholder-style="text-align:right;padding-right:20rpx;font-size:23rpx" style="width: 100%;text-align: right; padding-right:20rpx"/>
			    <u-icon name="arrow-right" color="rgba(3, 31, 55, 0.6);" size="15"></u-icon>
			</view>	
			
			
			
			<view class="flex uni-form-item all_shop border-b">
				<view class="title" style="width: 185rpx;">目前从事行业</view>
				<input class="uni-input ml-30 text-right" v-model="formData.industry" focus placeholder="请输入"  placeholder-style="text-align: right;font-size:23rpx"/>
			</view>	
			<view class="flex uni-form-item all_shop border-b">
				<view class="title" style="width: 125rpx;">年龄</view>
				<view class="flex">
					<text>{{formData.age}}</text>
					<u-icon name="arrow-right" color="rgba(3, 31, 55, 0.6);" size="15" @click="ageStatus"></u-icon>
				</view>
				
			</view>	
		</view>
			<button @click="submit" v-if="userInfo.is_group ==0" >提交</button>
			<button  v-if="userInfo.is_group ==1" style="background-color: gray;">信息审核中</button>
			<button @click="submit" v-if="userInfo.is_group ==3" >审核失败，提交</button>
		</view>
		
		<u-picker :show="show" ref="uPicker" :columns="cityList" @confirm="confirm" @change="changeHandler" @cancel="show = false"></u-picker>
		<u-picker :show="age_show" :columns="columns" @confirm="ageconfirm"></u-picker> 
	</view>
</template>

 
<script>
	import cityData from '@/utils/city.js'
	export default {
		data() {
			return {
				...getApp().globalData.config,	
				formData: {
					realname: '',
					phone: '',
					industry: '',
					province: '',
					city:'',
					area:'',
					area_info:'',
					age:'',				
				},
				cityList: [],
				cityLevel1: [],
				cityLevel2: [],
				cityLevel3: [],
				show: false,
				age_show:false,
				columns: [
					['18-25', '26-35', '36-45','46-55']
				],
				userInfo:{}
				
			};
		},
		onLoad() {
				this.initCityData();
		},
		onShow() {
			this.query_member()
		},		
		methods: {
			...getApp().globalData.function,
			
			//获取用户信息
			query_member(){
				let that=this
				let user_info=uni.getStorageSync('userInfo');
				let obj_data={
					token:user_info.token,
				    login_type:'app'
				};
				this.$http.getUser(obj_data).then(res=>{	
					console.log('res.data',res.data.is_group)
					if(res.data.is_group==2){
						this.$routers.router('/pages/pagesuser/share_poster/index','navigateTo') 
					}else{
						if(res.resCode=='9999'){
						    that.userInfo=res.data
						}	
					}
								
				})		
			},
			ageStatus(){
			    console.log('ok')
				this.age_show=true
			},
			//年龄选择
			ageconfirm(e){
			    console.log('confirm', e.value[0])
				this.formData.age=e.value[0]
				this.age_show = false
			},
			initCityData(){
				// 遍历城市js
				cityData.forEach((item1, index1) =>{
					let temp2 = [];
					this.cityLevel1.push(item1.provinceName);
					
					let temp4 = [];
					let temp3 = [];
					// 遍历市
					item1.cities.forEach((item2, index2) =>{
						temp2.push(item2.cityName);
						// 遍历区
						item2.counties.forEach((item3, index3) =>{
							temp3.push(item3.countyName);
						})
						temp4[index2] = temp3;
						temp3 = [];
					})
					this.cityLevel3[index1] = temp4;
					
					this.cityLevel2[index1] = temp2;
				})
				// 选择器默认城市
				this.cityList.push(this.cityLevel1,this.cityLevel2[0],this.cityLevel3[0][0]);
			},
			
			getbox(){
				this.show = true;
			},
			// 单击确认按钮时执行
			confirm(e) {
				// 输出数组 [省, 市, 区]
				this.formData.province=e.value[0]
				this.formData.city=e.value[1]
				this.formData.area=e.value[2]
				this.formData.area_info=e.value.join(',')
				// 隐藏城市选择器
				this.show = false;
			},
			//提交
			submit(){
				let formData=this.formData
				if(!formData.realname){
					this.$showToast('请填写姓名！')
					return false
				}
				if(!formData.phone){
					this.$showToast('请填写手机号！')
					return false
				}
				if(!formData.province){
					this.$showToast('请填写城市信息！')
					return false
				}	
				if(!formData.industry){
					this.$showToast('请填写从事行业！')
					return false
				}
				if(!formData.age){
					this.$showToast('请填写年龄！')
					return false
				}
				formData.token=uni.getStorageSync('userInfo').token
				console.log('formData',formData)
				this.$http.applyGroup(formData).then(res=>{
					if(res.resCode=='9999'){
						this.$showToast(res.resMessage)	
						setTimeout(function(){
							 uni.switchTab({
							   url: '/pages/mine/index'
							 })	
						}, 1500)
					}else{
						 this.$showToast(res.resMessage)	
					}
				})
			}
			
		},
	};
</script>
 
<style>
	
		@import url("./index.css");
</style>